<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Log In</title>
<script type="text/javascript" src="script/jquery.js"></script>
<style type="text/css">
body{
font-size:12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding:0 10px;
background-color:#F2F5F7;
}
td{
border:0
}
</style>
<script type="text/javascript">
function emptyCheck(){
	if($("#uid").val()==""){
		alert("Please enter the user name");
		$("#uid").focus();
	}
	else if($("#pwd").val()==""){
		alert("Please enter the passward");
		$("#pwd").focus();
	}else{
		$("#loginForm").submit();	
	}
}

</script>
</head>
<body>
<div id="container"  style="width:60%;min-height:500px;padding: 10px;margin-top:50px;margin-left:auto;margin-right:auto">
   <% 
   String message = (String)request.getAttribute("message");
   if(message!=null && message.equals("error")){
	   out.write("<div>We couldn't verify your username and password. Please double-check them and try again.</div> ");
   }
%>
   <div style="font-weight:bold;padding:0 5px;line-height: 40px;" align="center">
       <h3>Welcome to Aquila!</h3>
   </div>
   <div id="loginDiv" style="margin-top: 40px">
   <table border="1" border="0" bgcolor="#E5ECF9" style="margin-left:auto;margin-right:auto">
   <tbody>
    <tr>
     <td >
        <div align="center">Log In</div>      
     </td>
    </tr>
    <form action="login" method="post" id="loginForm">
    <tr>
     <td height="50" align="right">
       <span >User name</span>            
       <input type="text" name="uid" maxlength="20" style="width:150" id ="uid" />
       </td>
    </tr>
    <tr>
      <td  align="right">
         <span >Password</span>
         <input type="password" name="pwd" maxlength="20" style="width:150" id ="pwd" />
       </td>
     </tr>
     <center>
      <tr>
        <td>
          <div align="center">
              <input type="button" value="Login"  onclick="emptyCheck()" />&nbsp;&nbsp; 
              <input type="reset" value="Reset">
          </div>
          </td>
       </tr>
     </center>
    </form>  
    </tbody>
    </table>
		<div align="center" style="margin-top:20px"><a href="register.jsp" style="color:##0000FF;">Create a new account</a></div> 
	</div>
</div>
</body>
</html>